<template>
  <div>
    <!-- 导航 -->
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/home' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>医生排班管理</el-breadcrumb-item>
    </el-breadcrumb>
    <el-row>
      <el-col :span="4" :offset="6">
        <el-button type="primary" @click="torule()">设置排班规则</el-button>
      </el-col>
      <el-col :span="4">
        <el-button type="success" @click="creatSchedulingShow=true">生成排班计划</el-button>
      </el-col>
      <el-col :span="5">
        <el-button type="danger" @click="deleteSchedulingShow=true">按科室删除排班计划</el-button>
      </el-col>
    </el-row>
    <!-- 查询框 -->
    <el-form
      :inline="true"
      ref="SchedulingSearchFormRef"
      :model="SchedulingSearchForm"
      class="demo-form-inline"
    >
      <el-form-item label="查询时间">
        <div class="block">
          <el-date-picker
            v-model="DateArray"
            clearable
            value-format="yyyy-MM-dd"
            type="daterange"
            align="right"
            unlink-panels
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            :picker-options="pickerOptions"
          ></el-date-picker>
        </div>
      </el-form-item>
      <el-form-item label="用户所在科室">
        <el-select v-model="SchedulingSearchForm.deptid" filterable>
          <el-option label="空" :value="null"></el-option>
          <el-option
            v-for="item in DepartmentArray"
            :key="item.id"
            :label="item.deptname"
            :value="item.id"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="searchSchedulingList(1)">查询</el-button>
      </el-form-item>
    </el-form>
    <!-- 标签 -->
    <el-tag size="mini" v-show="TagShow" type="danger">无查询日期则默认查询本月排班信息*</el-tag>
    <!-- 显示列表 -->
    <el-table :data="SchedulingArray" style="width: 100%" border>
      <el-table-column prop="scheddate" label="日期" sortable fixed :formatter="toDateShow"></el-table-column>
      <el-table-column prop="user.realname" label="姓名" sortable fixed></el-table-column>
      <el-table-column prop="user.department.deptname" label="科室"></el-table-column>
      <el-table-column prop="noon" label="午别"></el-table-column>
      <el-table-column prop="rule.rulename" label="排班规则名称"></el-table-column>
    </el-table>
    <!-- 分页条 -->
    <div class="block" style="margin-top:1rem;margin-left:20%">
      <el-pagination
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :total="pageInfo.total"
        :current-page="pageInfo.pageNum"
        :page-sizes="[8,16,32,50,100]"
        :page-size="pageInfo.pageSize"
        layout=" prev, pager, next, jumper,total, sizes"
      ></el-pagination>
    </div>
    <!-- 回到顶部 -->
    <el-backtop :bottom="100">
      <div
        style="{
            height: 100%;
            width: 100%;
            background-color: #f2f5f6;
            box-shadow: 0 0 6px rgba(0,0,0, .12);
            text-align: center;
            line-height: 40px;
            color: #1989fa;
          }"
      >UP</div>
    </el-backtop>
    <!-- 生成排班信息弹窗 -->
    <el-dialog
      title="排班规则"
      :visible.sync="creatSchedulingShow"
      width="50%"
      center
      @open="searchRuleList"
      @close="closecreatScheduling"
      :lock-scroll="true"
      :append-to-body="true"
    >
      <el-form
        label-position="left"
        ref="createSchedulingFormRef"
        :model="insertForm"
        :rules="GlobalFormrules"
      >
        <el-form-item label="选择科室">
          <el-select v-model="insertForm.insertdeptid" filterable>
            <el-option label="空" :value="null"></el-option>
            <el-option
              v-for="item in DepartmentArray"
              :key="item.id"
              :label="item.deptname"
              :value="item.id"
            ></el-option>
          </el-select>
          <el-button style="margin-left:5%" type="primary" @click="searchRuleList(1)">查询</el-button>
          <el-button type="primary" @click="clearCreateData()">
            <i class="el-icon-refresh" style="margin-right:10px"></i>清空
          </el-button>
        </el-form-item>
        <!-- 排班规则列表展示 -->
        <el-table
          ref="RuleFormRef"
          :data="ruleListArray"
          tooltip-effect="dark"
          :row-key="RuleFormRefkey"
          border
          style="margin-left:-5%"
          @selection-change="handleSelectionChange"
        >
          <el-table-column type="selection" width="55" :reserve-selection="true"></el-table-column>
          <el-table-column label="排序规则名称" prop="rulename" sortable></el-table-column>
          <el-table-column prop="deptid" label="科室" sortable>
            <template slot-scope="scope">
              <div v-if="scope.row.department!=null">{{ scope.row.department.deptname }}</div>
              <div v-else>无</div>
            </template>
          </el-table-column>
          <el-table-column label="操作">
            <template slot-scope="scope">
              <el-button
                type="primary"
                icon="el-icon-search"
                plain
                @click="showRule(scope.row)"
                circle
              ></el-button>
            </template>
          </el-table-column>
        </el-table>
        <el-form-item label="选取时间" prop="DateArray1">
          <div class="block">
            <el-date-picker
              v-model="insertForm.DateArray1"
              clearable
              value-format="yyyy-MM-dd"
              type="daterange"
              align="right"
              unlink-panels
              range-separator="至"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              :picker-options="pickerOptions1"
            ></el-date-picker>
          </div>
        </el-form-item>
      </el-form>
      <!-- 分页条 -->
      <div class="block" style="margin-top:1rem;margin-left:20%">
        <el-pagination
          background
          @size-change="handleSizeChange1"
          @current-change="handleCurrentChange1"
          :total="pageInfo1.total"
          :current-page="pageInfo1.pageNum"
          :page-sizes="[8,16,32,50,100]"
          :page-size="pageInfo1.pageSize"
          layout=" prev, pager, next, jumper,total, sizes"
        ></el-pagination>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="creatScheduling('createSchedulingFormRef')">选取规则生成排班计划</el-button>
        <el-button @click="creatSchedulingShow = false">取 消</el-button>
      </span>
    </el-dialog>
    <!-- 按科室删除排班信息弹窗 -->
    <el-dialog
      title="按科室删除排班信息"
      :visible.sync="deleteSchedulingShow"
      width="35%"
      center
      @close="closedeleteSchedulingDialog"
    >
      <el-form label-position="left">
        <el-form-item label="选择科室">
          <el-select v-model="deletedeptid" filterable>
            <el-option label="空" :value="null"></el-option>
            <el-option
              v-for="item in DepartmentArray"
              :key="item.id"
              :label="item.deptname"
              :value="item.id"
            ></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <!-- 标签 -->
      <el-tag
        size="mini"
        v-show="TagShow_d"
        type="danger"
        style="margin-left:12%"
      >无科室选择则默认选择清空所有科室今日及以后排班计划*</el-tag>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="deleteByDeptid">确认删除</el-button>
        <el-button @click="deleteSchedulingShow = false">取 消</el-button>
      </span>
    </el-dialog>
    <!-- 查看排班规则详细信息弹窗 -->
    <el-dialog
      title="排班规则详情"
      :visible.sync="oneRuleShow"
      width="68%"
      center
      class="checkbox-div"
      :lock-scroll="true"
      @close="closeRuleShowDialog"
      :append-to-body="true"
    >
      <el-tag type="success" style="margin-left:0%">规则名称：{{show_rulename}}</el-tag>
      <el-tag type="warning">部门名称：{{show_deptname}}</el-tag>
      <el-table :data="RuleDetailShow" height="300" border>
        <el-table-column fixed prop="user.realname" label="姓名"></el-table-column>
        <el-table-column label="星期一" width="60px">
          <el-table-column prop="weekdetail[0].morning" label="上午" width="55%">
            <template slot-scope="scope">
              <el-checkbox
                disabled
                true-label="1"
                false-label="0"
                v-model="scope.row.weekdetail[0].morning"
              ></el-checkbox>
            </template>
          </el-table-column>
          <el-table-column prop="weekdetail[0].afternoon" label="下午" width="55%">
            <template slot-scope="scope">
              <el-checkbox
                disabled
                true-label="1"
                false-label="0"
                v-model="scope.row.weekdetail[0].afternoon"
              ></el-checkbox>
            </template>
          </el-table-column>
        </el-table-column>
        <el-table-column label="星期二">
          <el-table-column prop="weekdetail[0].morning" label="上午" width="55%">
            <template slot-scope="scope">
              <el-checkbox
                disabled
                true-label="1"
                false-label="0"
                v-model="scope.row.weekdetail[1].morning"
              ></el-checkbox>
            </template>
          </el-table-column>
          <el-table-column prop="weekdetail[0].afternoon" label="下午" width="55%">
            <template slot-scope="scope">
              <el-checkbox
                disabled
                true-label="1"
                false-label="0"
                v-model="scope.row.weekdetail[1].afternoon"
              ></el-checkbox>
            </template>
          </el-table-column>
        </el-table-column>
        <el-table-column label="星期三">
          <el-table-column prop="weekdetail[0].morning" label="上午" width="55%">
            <template slot-scope="scope">
              <el-checkbox
                disabled
                true-label="1"
                false-label="0"
                v-model="scope.row.weekdetail[2].morning"
              ></el-checkbox>
            </template>
          </el-table-column>
          <el-table-column prop="weekdetail[0].afternoon" label="下午" width="55%">
            <template slot-scope="scope">
              <el-checkbox
                disabled
                true-label="1"
                false-label="0"
                v-model="scope.row.weekdetail[2].afternoon"
              ></el-checkbox>
            </template>
          </el-table-column>
        </el-table-column>
        <el-table-column label="星期四">
          <el-table-column prop="weekdetail[0].morning" label="上午" width="55%">
            <template slot-scope="scope">
              <el-checkbox
                disabled
                true-label="1"
                false-label="0"
                v-model="scope.row.weekdetail[3].morning"
              ></el-checkbox>
            </template>
          </el-table-column>
          <el-table-column prop="weekdetail[0].afternoon" label="下午" width="55%">
            <template slot-scope="scope">
              <el-checkbox
                disabled
                true-label="1"
                false-label="0"
                v-model="scope.row.weekdetail[3].afternoon"
              ></el-checkbox>
            </template>
          </el-table-column>
        </el-table-column>
        <el-table-column label="星期五">
          <el-table-column prop="weekdetail[0].morning" label="上午" width="55%">
            <template slot-scope="scope">
              <el-checkbox
                disabled
                true-label="1"
                false-label="0"
                v-model="scope.row.weekdetail[4].morning"
              ></el-checkbox>
            </template>
          </el-table-column>
          <el-table-column prop="weekdetail[0].afternoon" label="下午" width="55%">
            <template slot-scope="scope">
              <el-checkbox
                disabled
                true-label="1"
                false-label="0"
                v-model="scope.row.weekdetail[4].afternoon"
              ></el-checkbox>
            </template>
          </el-table-column>
        </el-table-column>
        <el-table-column label="星期六">
          <el-table-column prop="weekdetail[0].morning" label="上午" width="55%">
            <template slot-scope="scope">
              <el-checkbox
                disabled
                true-label="1"
                false-label="0"
                v-model="scope.row.weekdetail[5].morning"
              ></el-checkbox>
            </template>
          </el-table-column>
          <el-table-column prop="weekdetail[0].afternoon" label="下午" width="55%">
            <template slot-scope="scope">
              <el-checkbox
                disabled
                true-label="1"
                false-label="0"
                v-model="scope.row.weekdetail[5].afternoon"
              ></el-checkbox>
            </template>
          </el-table-column>
        </el-table-column>
        <el-table-column label="星期日">
          <el-table-column prop="weekdetail[0].morning" label="上午" width="55%">
            <template slot-scope="scope">
              <el-checkbox
                disabled
                true-label="1"
                false-label="0"
                v-model="scope.row.weekdetail[6].morning"
              ></el-checkbox>
            </template>
          </el-table-column>
          <el-table-column prop="weekdetail[0].afternoon" label="下午" width="55%">
            <template slot-scope="scope">
              <el-checkbox
                disabled
                true-label="1"
                false-label="0"
                v-model="scope.row.weekdetail[6].afternoon"
              ></el-checkbox>
            </template>
          </el-table-column>
        </el-table-column>
      </el-table>
      <!-- 分页条 -->
      <div class="block" style="margin-top:1rem">
        <el-pagination
          background
          @size-change="handleSizeChange2"
          @current-change="handleCurrentChange2"
          :total="pageInfo2.total"
          :current-page="pageInfo2.pageNum"
          :page-sizes="[8,16,32,50,100]"
          :page-size="pageInfo2.pageSize"
          layout=" prev, pager, next, jumper,total, sizes"
        ></el-pagination>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="oneRuleShow = false">关闭</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
export default {
  data() {
    return {
      // 搜索框对象
      SchedulingSearchForm: {
        //查询条件_科室
        deptid: null,
      },
      //按科室删除科室id
      deletedeptid: null,
      // 查询条件_时间数组
      DateArray: null,
      // 生成排班计划选取时间数组
      insertForm: {
        DateArray1: null,
        //排班规则条件查询对象
        insertdeptid: null,
        //排班规则状态保持
        insertdeptid_copy: null,
      },
      //排班信息数组
      SchedulingArray: [],
      // 科室列表
      DepartmentArray: [],
      // 排班规则列表
      ruleListArray: [],
      //显示规则详情对象
      RuleDetailShow: [],
      show_rulename: "",
      show_deptname: "",
      show_deptid: null,

      // 页面信息
      pageInfo: {
        pageNum: 1,
        pageSize: 8,
        total: 0,
      },
      //生成排班计划页面信息
      pageInfo1: {
        pageNum: 1,
        pageSize: 8,
        total: 0,
      },
      // 页面信息_查看详情
      pageInfo2: {
        pageNum: 1,
        pageSize: 8,
        total: 0,
      },
      // 生成排班信息弹窗
      creatSchedulingShow: false,
      // 按科室删除排班信息弹窗
      deleteSchedulingShow: false,
      //展示规则细节的信息弹窗
      oneRuleShow: false,
      multipleSelection: [],
      //验证规则
      GlobalFormrules: {
        DateArray1: [
          { required: true, message: "请选择日期", trigger: "change" },
        ],
      },
      //日期快捷栏
      pickerOptions: {
        shortcuts: [
          {
            text: "上一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "下一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              end.setTime(end.getTime() + 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "上一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "本月至今",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setDate(1);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "今天至月末",
            onClick(picker) {
              var now = new Date(); //当前日期
              var nowMonth = now.getMonth(); //当前月
              var nowYear = now.getYear(); //当前年
              nowYear += nowYear < 2000 ? 1900 : 0;
              var monthStartDate = new Date(nowYear, nowMonth, 1);
              var monthEndDate = new Date(nowYear, nowMonth + 1, 1);
              var days =
                (monthEndDate - monthStartDate) / (1000 * 60 * 60 * 24);
              const EndDate = new Date(nowYear, nowMonth, days);
              const start = new Date();
              picker.$emit("pick", [start, EndDate]);
            },
          },
          {
            text: "下一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              end.setTime(end.getTime() + 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            },
          },
        ],
      },
      //日期快捷栏1
      pickerOptions1: {
        disabledDate(time) {
          return time.getTime() < Date.now() - 8.64e7;
        },
        shortcuts: [
          {
            text: "至下一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              end.setTime(end.getTime() + 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            },
          },
          {
            text: "今天至月末",
            onClick(picker) {
              var now = new Date(); //当前日期
              var nowMonth = now.getMonth(); //当前月
              var nowYear = now.getYear(); //当前年
              nowYear += nowYear < 2000 ? 1900 : 0;
              var monthStartDate = new Date(nowYear, nowMonth, 1);
              var monthEndDate = new Date(nowYear, nowMonth + 1, 1);
              var days =
                (monthEndDate - monthStartDate) / (1000 * 60 * 60 * 24);
              const EndDate = new Date(nowYear, nowMonth, days);
              const start = new Date();
              picker.$emit("pick", [start, EndDate]);
            },
          },
          {
            text: "至下一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              end.setTime(end.getTime() + 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            },
          },
        ],
      },
    };
  },
  created() {
    //查询本月排班信息
    this.searchSchedulingList();
    // 查询科室列表
    this.searchDepartmentList();
  },
  methods: {
    // 跳转Rule页面
    torule() {
      this.$router.push("/rule");
    },

    //查询排班计划列表
    async searchSchedulingList(pnum) {
      let startdate = null;
      let overdate = null;
      if (this.DateArray == null) {
        startdate = this.getMonthStartDate();
        overdate = this.getMonthEndDate();
      } else {
        startdate = this.DateArray[0];
        overdate = this.DateArray[1];
      }
      if (pnum != null) {
        this.pageInfo.pageNum = pnum;
      }
      const { data: res } = await this.$http.post(
        "scheduling/SchedulingService",
        {
          starttime: startdate,
          overtime: overdate,
          deptid: this.SchedulingSearchForm.deptid,
          pageNum: this.pageInfo.pageNum,
          pageSize: this.pageInfo.pageSize,
        }
      );

      this.SchedulingArray = res.info.list;
      this.pageInfo.pageNum = res.info.pageNum;
      this.pageInfo.pageSize = res.info.pageSize;
      this.pageInfo.total = res.info.total;
      console.log(res.info);
    },
    //查询科室列表
    async searchDepartmentList() {
      const {
        data: res,
      } = await this.$http.post("department/findAllDepartmentByCondition", {
        id: 1,
      });
      if (res.meta.status !== 200) {
        return this.$message.error("获取科室列表失败");
      }
      this.DepartmentArray = res.list;
      // console.log(res);
    },
    // 查询排班规则信息
    async searchRuleList(pnum) {
      if (pnum != null) {
        this.pageInfo1.pageNum = pnum;
      }
      if (this.insertForm.insertdeptid_copy != this.insertForm.insertdeptid) {
        this.$refs.RuleFormRef.clearSelection();
        this.insertForm.insertdeptid_copy = this.insertForm.insertdeptid;
      }

      const { data: res } = await this.$http.post(
        "rule/findAllByConditionByPage",
        {
          deptid: this.insertForm.insertdeptid,
          pageNum: this.pageInfo1.pageNum,
          pageSize: this.pageInfo1.pageSize,
        }
      );
      if (res.meta.status !== 200) {
        return this.$message.error("获取排班规则列表失败");
      }
      this.ruleListArray = res.info.list;
      this.pageInfo1.pageNum = res.info.pageNum;
      this.pageInfo1.pageSize = res.info.pageSize;
      this.pageInfo1.total = res.info.total;

      console.log(this.ruleListArray);
    },
    //生成排班计划表_绑定key
    RuleFormRefkey(row) {
      return row.id;
    },
    //关闭生成排班计划弹窗
    closecreatScheduling() {
      this.$refs.RuleFormRef.clearSelection();
      console.log(this.multipleSelection);
      this.insertForm.DateArray1 = null;
      this.creatSchedulingShow = false;
      this.insertForm.insertdeptid = null;
    },
    //清除生成排班计划选择表
    clearCreateData() {
      this.insertForm.insertdeptid = null;
      this.insertForm.DateArray1 = null;
      this.$refs.RuleFormRef.clearSelection();
    },
    //查看一个规则信息
    async showRule(row) {
      //  this.startLoading();
      //  setTimeout(this.endLoading(),1000)
      const { data: res } = await this.$http.post("rule/findRuleByCondition", {
        rulename: row.rulename,
        deptid: row.deptid,
        pageNum: this.pageInfo1.pageNum,
        pageSize: this.pageInfo1.pageSize,
      });
      if (res.meta.status !== 200) {
        return this.$message.error("获取规则详情失败");
      }
      //详情
      this.RuleDetailShow = res.info.list;
      this.show_rulename = res.info.list[0].rulename;
      this.show_deptname = res.info.list[0].department.deptname;
      this.show_deptid = res.info.list[0].department.id;

      this.pageInfo2.pageNum = res.info.pageNum;
      this.pageInfo2.pageSize = res.info.pageSize;
      this.pageInfo2.total = res.info.total;

      this.oneRuleShow = true;
      console.log(res.info.list);
    },
    //查看规则弹窗关闭
    closeRuleShowDialog() {
      this.pageInfo1.pageNum = 1;
      this.oneRuleShow = false;
    },
    //选取规则生成到计划表
    creatScheduling(formName) {
      this.$refs[formName].validate(async (valid) => {
        if (this.multipleSelection.length == 0) {
          this.$message.error("请选择至少一个规则");
          return false;
        }
        if (valid) {
          const { data: res } = await this.$http.post(
            "scheduling/saveSchedulingByRule",
            {
              starttime: this.insertForm.DateArray1[0],
              overtime: this.insertForm.DateArray1[1],
              rulelist: this.multipleSelection,
            }
          );
          if (res.meta.status !== 200) {
            return this.$message.error("规则表生成失败");
          }
          this.creatSchedulingShow = false;
          this.DateArray = null;
          this.$message.success("设置排班计划成功");
          this.searchSchedulingList(1);
        } else {
          this.$message.error("验证失败");
          return false;
        }
      });
      //this.creatSchedulingShow=false;
    },
    // 按照科室删除排班计划
    deleteByDeptid() {
      this.$confirm(
        "此操作将删除科室下所有今日至以后排班计划, 是否继续?",
        "提示",
        {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "error",
        }
      )
        .then(async () => {
          let starttime = this.formatDate(new Date());
          const { data: res } = await this.$http.post(
            "scheduling/deleteByDeptidByDate",
            {
              starttime: starttime,
              deptid: this.deletedeptid,
            }
          );
          if (res.meta.status !== 200) {
            return this.$message.error("删除排班计划失败");
          }
          this.DateArray = null;
          this.deletedeptid = null;
          this.searchSchedulingList(1);
          this.deleteSchedulingShow = false;
          this.$message({
            type: "success",
            message: "删除排班计划成功",
          });
          return;
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
    //关闭删除弹窗
    closedeleteSchedulingDialog() {
      this.deletedeptid = null;
      this.deleteSchedulingShow = false;
    },
    //分页函数 查询条数改变
    handleSizeChange(size) {
      this.pageInfo.pageSize = size;
      this.searchSchedulingList(1);
    },
    //分页函数 查询页数改变
    handleCurrentChange(page) {
      this.pageInfo.pageNum = page;
      this.searchSchedulingList();
    },
    //排班规则分页函数 查询条数改变
    handleSizeChange1(size) {
      this.pageInfo1.pageNum = 1;
      this.pageInfo1.pageSize = size;
      this.searchRuleList();
    },
    //排班规则分页函数 查询页数改变
    handleCurrentChange1(page) {
      this.pageInfo1.pageNum = page;
      this.searchRuleList();
    },
    handleSizeChange2(size) {
      this.pageInfo2.pageNum = 1;
      this.pageInfo2.pageSize = size;
      let row = {
        rulename: this.show_rulename,
        deptid: this.show_deptid,
      };
      this.showRule(row);
    },
    //分页函数_查看详情 查询页数改变
    handleCurrentChange2(page) {
      this.pageInfo2.pageNum = page;
      let row = {
        rulename: this.show_rulename,
        deptid: this.show_deptid,
      };
      this.showRule(row);
    },
    //多选选中项目行
    handleSelectionChange(val) {
      //拷贝数据，不拷贝引用
      let temp = Object.assign({}, val);
      temp.user = null;
      this.multipleSelection = [];
      for (let index in val) {
        this.multipleSelection[index] = temp[index];
      }

      console.log(this.multipleSelection);
    },
    //日期方法
    //获得某月的天数
    getMonthDays() {
      var now = new Date(); //当前日期
      var nowDayOfWeek = now.getDay(); //今天本周的第几天
      var nowDay = now.getDate(); //当前日
      var myMonth = now.getMonth(); //当前月
      var nowYear = now.getYear(); //当前年
      nowYear += nowYear < 2000 ? 1900 : 0;
      var monthStartDate = new Date(nowYear, myMonth, 1);
      var monthEndDate = new Date(nowYear, myMonth + 1, 1);
      var days = (monthEndDate - monthStartDate) / (1000 * 60 * 60 * 24);
      return days;
    },
    //获得本月的开始日期
    getMonthStartDate() {
      var now = new Date(); //当前日期
      var nowMonth = now.getMonth(); //当前月
      var nowYear = now.getYear(); //当前年
      nowYear += nowYear < 2000 ? 1900 : 0;
      var monthStartDate = new Date(nowYear, nowMonth, 1);
      return this.formatDate(monthStartDate);
    },
    //获得本月的结束日期
    getMonthEndDate() {
      var now = new Date(); //当前日期
      var nowMonth = now.getMonth(); //当前月
      var nowYear = now.getYear(); //当前年
      nowYear += nowYear < 2000 ? 1900 : 0;
      var monthEndDate = new Date(nowYear, nowMonth, this.getMonthDays());
      return this.formatDate(monthEndDate);
    },
    //格式化日期：yyyy-MM-dd
    formatDate(date) {
      var myyear = date.getFullYear();
      var mymonth = date.getMonth() + 1;
      var myweekday = date.getDate();
      if (mymonth < 10) {
        mymonth = "0" + mymonth;
      }
      if (myweekday < 10) {
        myweekday = "0" + myweekday;
      }
      return myyear + "-" + mymonth + "-" + myweekday;
    },
    //日期格式化
    toDateShow(row) {
      if (row == null) {
        return;
      }
      let sss = row.scheddate;
      let d = new Date();
      d.setTime(sss);
      let value = this.formatDate(d);
      return value;
    },
  },
  computed: {
    // 提示标签是否显示
    TagShow() {
      return this.DateArray == null ? true : false;
    },
    // 提示标签是否显示_删除弹窗
    TagShow_d() {
      return this.deletedeptid == null ? true : false;
    },
  },
};
</script>
<style lang="less" scoped>
.el-row {
  margin-bottom: 2rem;
  &:last-child {
    margin-bottom: 0;
  }
}
.el-col {
  border-radius: 4px;
}
.bg-purple-dark {
  background: #99a9bf;
}
.bg-purple {
  background: #d3dce6;
}
.bg-purple-light {
  background: #e5e9f2;
}
.grid-content {
  border-radius: 4px;
  min-height: 36px;
}
.row-bg {
  padding: 10px 0;
  background-color: #f9fafc;
}
.el-form {
  margin-left: 15%;
}
.el-form {
  .el-table {
    margin-left: -10%;
  }
}
//---表格文本居中---
/deep/.el-table th > .cell {
  text-align: center;
}
/deep/.el-table .cell {
  text-align: center;
}
//---表格文本居中---
//checkbox选中后样式
.checkbox-div {
  // 未选中样式
  /deep/ .el-checkbox__inner {
    border-radius: 0;
    background-color: #a8a8a8;
  }
  /deep/ .el-checkbox {
    color: #a8a8a8;
  }
  /deep/ .el-checkbox__input.is-checked + .el-checkbox__label {
    color: #409eff;
  }
  /deep/ .el-checkbox__input.is-checked .el-checkbox__inner {
    // 选中后样式
    background-color: #409eff;
    // border-color: #409EFF;
  }
  // 加未选中的 对号 css
  .unselected .el-checkbox__input .el-checkbox__inner::after {
    // ::after {
    // 对号
    border: 2px solid red;
    // 不覆盖下面的 会 导致对号变形
    box-sizing: content-box;
    content: "";
    border-left: 0;
    border-top: 0;
    height: 7px;
    left: 3px;
    position: absolute;
    top: 1px;
    width: 3px;
    // }
  }
  /deep/ .el-checkbox__input .el-checkbox__inner::after {
    // 对号
    border: 2px solid #fff;
    // 不覆盖下面的 会 导致对号变形
    box-sizing: content-box;
    content: "";
    border-left: 0;
    border-top: 0;
    height: 7px;
    left: 3px;
    position: absolute;
    top: 1px;
    width: 3px;
    //
    transform: rotate(45deg) scaleY(1);
  }
}
</style>

